<template>
  <div id="verification" class="verification same-change-oldstyle">
      <div class="same-head-box" >
          <div class="saem-seat-box" >
            <div class="saem-seat-left">
              <span>当前位置：</span>
                  <el-breadcrumb separator-class="el-icon-arrow-right">
                    <el-breadcrumb-item >水卡管理</el-breadcrumb-item>
                    <el-breadcrumb-item>普通水卡</el-breadcrumb-item>
                    <el-breadcrumb-item>水卡申请</el-breadcrumb-item>
                  </el-breadcrumb>
            </div>
            <div class="saem-seat-right">
              <button class="same-search-btns same-search-export" @click="RefreshFun">刷新</button>
              <button class="same-search-btns" @click="returnBack">返回</button>
            </div>
          </div>
      </div>
        <div class="verificationContent">
            <div class="list_s" >
                <span class="otherSize">用户姓名:</span>
                <span>{{obj_data.full_name}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">手机号码:</span>
                <span>{{obj_data.tel}}</span>
            </div>
            <div v-if="obj_data.IDcard" class="list_s" >
                <span class="otherSize">身份证号:</span>
                <span>{{obj_data.IDcard}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">地址信息:</span>
                <span>{{obj_data.address}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">门牌信息:</span>
                <span>{{obj_data.address_two}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">所属园区:</span>
                <span>{{obj_data.village_name}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">水卡卡号:</span>
                <span>{{obj_data.card_number}}</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">充值金额:</span>
                <span v-if="obj_data.rechargesIndex != -1">{{obj_data.valueprice}}</span>
                <span v-else>{{obj_data.valueprice}}-{{obj_data.other_money}}元</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">押金:</span>
                <span>{{obj_data.depositIndex}}元</span>
            </div>
            <div class="list_s" >
                <span class="otherSize">办理状态:</span>
                <span>{{obj_data.audit_status}}</span>
            </div>
            <div class="btnallBox">
              <button type="" @click='jumpDetail($event)' class="blud">确认无误</button>
              <button type="" @click='jumpback()' class="gry">返回修改</button>
            </div>
        </div>
      <div class="Promptmodelwrap">
        <div class="Promptmodel">
          <img src="../../../static/images/successicon.png" v-show="!success"/>
          <span v-show="!success">办理成功！</span>
          <img src="../../../static/images/failicon.png" v-show="success"/>
          <span v-show="success">{{message}}</span>
        </div>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'verification',
    data: function () {
      return {
        success:true,
          obj_data: locache.get('verification'), // 水卡申请信息
          message: '',
      }
    },
    computed:{

    },
    created(){
      // setTimeout(function () {
      //   locache.remove('verification');
      // },2000);
    },
    inject: ['reload'],
    methods: {
      RefreshFun(){
        // 调用reload方法，刷新整个页面
        this.reload()
      },
      //返回
      returnBack(){
        this.$router.back(-1);
      },
      // 确认无误
      jumpDetail(e){
          // this.$router.push({path: ''})
          var that = this;
          var obj = e.target;
        // $('.Promptmodelwrap').stop(true, success).fadeIn().delay(2000).fadeOut();
        var obj_data = locache.get('verification');
        // console.info(obj_data);
          //ajax请求
          this.$post({
              url: 'Partner/WaterCard/entityCardApplication',
              data: {
                  full_name: obj_data.full_name,
                  tel: obj_data.tel,
                  IDcard: obj_data.IDcard,
                  province: obj_data.province,
                  city: obj_data.city,
                  area: obj_data.area,
                  address: obj_data.address,
                  address_two: obj_data.address_two,
                  village_name: obj_data.village_name,
                  card_number: obj_data.card_number,
                  deposit: obj_data.depositIndex,
                  audit_status: obj_data.audit_status,
                  recharge_money: obj_data.rechargesIndex != -1 ? obj_data.recharge:obj_data.other_money,
                  give_money: obj_data.give_money
              },

              success: (data)=>{
                  if (data.code == 1000) {
                      this.success = false;
                      this.message = '办理成功！';
                      $('.Promptmodelwrap').stop(true, true).fadeIn().delay(2000).fadeOut();
                      this.$message({
                          type:'success',
                          showClose: true,
                          message: data.message + '将在2s后跳转 ',
                          center: true
                      });
                      setTimeout(function () {
                          locache.remove('verification');
                          that.$router.push({ path: '/virtualCardList' });
                      },2000);

                  } else {
                      /*this.$message({
                          type:'error',
                          showClose: true,
                          message: data.message,
                          center: true
                      });*/
                      this.message = data.message;
                      $('.Promptmodelwrap').stop(true, true).fadeIn().delay(2000).fadeOut();
                      // setTimeout(function(){
                      //     this.$router.push({path: '/ordinaryapply'});
                      // },2000)
                  }
              }
          })
      },
      // 返回修改
      jumpback(){
        this.$router.back(-1)
      },
    },
      mounted (){

    }
  }
</script>
<style>
.verification{
  width: 100%;
  height:100%;
  background: #fff;
}
.verification .verificationContent{
   width: 100%;
}
.verification .verificationContent .list_s{
    cursor: pointer;
    margin:25px 40px;
    font-size: 14px;
    color:#000;
    display: flex;
    align-items: center;
}
.list_s .otherSize{
  width: 70px;
  color:#000;
  font-size: 16px;
}
.btnallBox{
  padding:40px 40px;
}
.btnallBox button{
width: 100px;
color: #fff;
font-weight: bold;
font-size: 14px;
margin-right: 30px;
height: 30px;
border:none;
border-radius: 4px;
}
.blud{
  background: #275485;
}
.gry{
  background: #B1B1B2;
}
  #verification .Promptmodel {
    position: absolute;
    width: 350px;
    height: 120px;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 10px #333;
    border-radius: 10px;

  }

  #verification .Promptmodel img {
    margin-right: 20px;
    width: 50px;
  }
  #verification .Promptmodelwrap{
    display: none;
  }
</style>
